'use client'

import { useRouter } from 'next-nprogress-bar'

interface BackButtonProps {
  children: React.ReactNode
}

const BackButton: React.FC<BackButtonProps> = (props) => {
  const { children } = props
  const { back } = useRouter()
  return (
    <button
      className='px-[0.71875rem] py-[0.59375rem] text-white text-[0.875rem] leading-[0.875rem] font-medium bg-[#0F0F19] rounded-[5px] lg:px-[1.5625rem] lg:py-[0.6875rem] lg:rounded-[0.4375rem] lg:text-[0.8125rem] lg:leading-[0.8125rem] 2xl:px-[2.34375rem] 2xl:py-[1.03125rem] 2xl:rounded-[0.65625rem] 2xl:text-[1.21875rem] 2xl:leading-[1.21875rem]'
      onClick={() => back()}
    >{`<${children}`}</button>
  )
}

export default BackButton
